main(function () {
    //变量
    var i;
    var lrc;//歌词
    var audio=$("#audio");
    var play=$("#play");
    var autoPlay=true;
    var isPlaying=false;
    var index=0;
    var w,h;//可见宽高
    var snowStatus=[];
    var snowSize=6;//大小
    var min=1;//最小size
    var snowSpeed=4;//速度
    var snowDensity=10;//密度
    var maxNum=1000;//最多同时存在数量
    var speedC=10;//速度差
    var snowLength=maxNum*snowDensity/100;
        //第一步 初始化绘制
         audio.volume=0.4;
        //第二步 请求歌词文件,请求完成并执行ready方法
    ajax(ready,"GET",audio.getAttribute("data-lrc"),true);//歌词将会作为参数传入Fun中
    function ready() {
        //第三步 歌词就绪，开始绘制
        lrc=arguments[0];//得到歌词，ready里面的第一个参数，ready里面最多只能放一个参数，只能是歌词，否则我也不知道会怎样
        lrcFun();
        canvasFun();
        playClick();
        //处理歌词方法
        function lrcFun() {
            lrc=lrc.replace(/(\n)+|(\r\n)+/g, "");
            lrc=lrc.split("[");
            lrc.splice(0,1);
            var lrcUl=$("#lrcUl");
            for(i=0;i<lrc.length;i++){
                lrc[i]=lrc[i].split("]");
                lrc[i][0]=(Number(lrc[i][0].substr(0,2)*60)+Number(lrc[i][0].substr(3))).toFixed(1);//调整时间格式，以秒为基本单位
                var li=document.createElement("LI");//创建每一句歌词的容器
                li.innerHTML=lrc[i][1];//容器放入歌词
                lrc[i].splice(2,0,li);//将容器与数组关联上
                lrcUl.appendChild(li);//添加到DOM
            }
            //歌词滚动实例化
            audio.ontimeupdate=function () {
                if(audio.currentTime>=lrc[index][0]){
                    lrc[index][2].style.color="#FF69B4";
                    lrcUl.style.top=280-index*40+"px";
                    index++;
                }
            }
        }
        function canvasFun() {
            var canvas=$("#canvas");//画布
            var catchCanvas=document.createElement("CANVAS");//缓冲画布
            var ctx=canvas.getContext("2d");
            var ogc=catchCanvas.getContext("2d");

            /**Audio analyser start**/
                //直接从audio处理音频源，声明一些必要的变量
            var context1;
            var source;
            var analyserfa;
            var array;

            try {

                context1 = new (window.AudioContext || window.webkitAudioContext);
            } catch(e) {
                throw new Error('The Web Audio API is unavailable');
            }
            //建立一个分析器
            analyserfa=context1.createAnalyser();
            // 从audio标签获取声音源 source
            source = context1.createMediaElementSource(audio);
            source.connect(analyserfa);
            analyserfa.connect(context1.destination);
            /**Audio analyser end**/

            setWH();
            window.addEventListener("resize", setWH);
            //初始化数据
            initData();
            requestAnimationFrame(callBack);
            function callBack() {
                /**Audio analyser start**/
                array =  new Uint8Array(128);
                //复制当前的频率值到一个无符号数组中
                analyserfa.getByteFrequencyData(array);
                /**Audio analyser end**/
                //清除缓冲画布
                ogc.clearRect(0,0,w,h);
                createSnow();
                readDataAndDraw();
                //开始绘制到缓冲画布
                drawAnalyser();
                //加载到真实画布
                ctx.drawImage(catchCanvas,0,0);
                requestAnimationFrame(callBack);
            }
            function drawAnalyser() {
                ogc.strokeStyle="#FF69B4";
                var grad  = ctx.createLinearGradient(0,0, 0,h/2);
                /* 指定几个颜色 */
                grad.addColorStop(0,'rgb(192, 80, 77)');    // 红
                grad.addColorStop(0.8,'rgb(192, 80, 77)');    // 红
                grad.addColorStop(1,'rgb(128, 100, 162)');  // 紫
                /* 将这个渐变设置为fillStyle */
                ogc.fillStyle = grad;
                ogc.beginPath();
                ogc.moveTo(0,h/2);
                ogc.lineTo(w,h/2);
                ogc.stroke();
                //起点
                var x=w/2-1280/2-150;
                for(i=1;i<array.length;i++){
                    ogc.fillRect(x=x+10,h/2-array[i],9,array[i]);
                }
                ctx.clearRect(0,0,w,h);
            }
            function setWH() {
                w=canvas.offsetWidth;
                h=canvas.offsetHeight;
                canvas.width=w;
                canvas.height=h;
                catchCanvas.width=w;
                catchCanvas.height=h;
            }
            function createSnow() {
                //判断这一帧是否需要创建
                if(Math.random()<snowDensity/100){
                    //如果创建，那么多少片雪花
                    var number;
                    var temp=Math.random();//随机同一帧创建的雪花数量
                    if(temp<=0.5)number=1;
                    else if(temp<=0.8)number=2;
                    else if(temp<=0.95)number=3;
                    else number=4;
                    for(var i=0;i<number;i++){
                        var color="rgba("+parseInt(Math.random()*254)
                            +","+parseInt(Math.random()*254)
                            +","+parseInt(Math.random()*254)
                            +","+parseInt(Math.random()*9)+")";
                        var radius=min+parseInt(Math.random()*(snowSize-min));
                        var position=parseInt(Math.random()*(w+(snowSize-min)*4))-(snowSize-min)*2;
                        snowStatus.splice(snowLength,1,{x:position,y:-radius*2,r:radius,c:color}); //将创建的雪花动态数据保存到数组
                        snowLength++;
                        snowLength>=maxNum+1&&(snowLength=0);
                    }
                }
            }
            //读取数据
            function readDataAndDraw() {
                ogc.clearRect(0,0,w,h);
                for(var i=0;i<snowStatus.length;i++){
                    var sr=snowStatus[i].r;
                    var pox=snowStatus[i].x;
                    var poy=snowStatus[i].y+=sr*speedC*snowSpeed/100;
                    snow(pox,poy,sr,snowStatus[i].c)
                }
            }
            //绘制雪花
            function  snow(x,y,r,c) {

                ogc.beginPath();
                ogc.strokeStyle=c;
                ogc.moveTo(x,y);
                ogc.lineTo(x+3*r,y);
                ogc.lineTo(x+0.5*r,y+1.5*r);
                ogc.lineTo(x+1.5*r,y-1.3*r);
                ogc.lineTo(x+2.5*r,y+1.5*r);
                ogc.closePath();
                ogc.stroke();
            }
            function initData() {
                for(var i=0;i<200;i++){
                    var color="rgba("+parseInt(Math.random()*254)
                        +","+parseInt(Math.random()*254)
                        +","+parseInt(Math.random()*254)
                        +","+parseInt(Math.random()*9)+")";
                    snowStatus.push({x:Math.random()*w,y:Math.random()*h,r:1+Math.random()*(snowSize-min),c:color});
                }
            }
        }
        function playClick() {
            audio.addEventListener('ended', function () {
                isPlaying=true;
                checkPlay();
                index=0;
            if(autoPlay){
                isPlaying=false;
                checkPlay();
            }});
            checkPlay();
            play.addEventListener("click",function () {
                isPlaying=!isPlaying;
                checkPlay();

            });
            function checkPlay() {
                if(index==0){
                    for(i=0;i<lrc.length;i++){lrc[i][2].style.color="";}}
                if(isPlaying)
                    toStop();
                else
                    toPlay();
            }
            function toPlay() {
                play.style.borderRadius="10px";
                audio.play();}
            function toStop() {
                play.style.borderRadius="100%";
                audio.pause();}
        }
    }
});
var t=false;
window.addEventListener("keydown",function (e) {
    t=!t;
    var a=$("#audio");
    e.which==67&&(t?a.controls="controls":a.removeAttribute("controls"));
});